<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <meta charset="utf-8">
    <title>地区报表</title>
    <link rel="stylesheet" href="${base}/layui/css/layui.css">
    <link rel="stylesheet" href="${base}/css/admin.css">
</head>

<body class="layui-layout-body" style="overflow:scroll;">
<#include "/common/left.flt">	
<div class="layui-main" style="position: absolute;left: 204px;top: 70px; width: calc(100% - 210px);" >
<blockquote class="layui-elem-quote layui-quote-nm">
 	<form action="${base}/admin/area" method="post" id="dataForm">
        <div class="layui-input-inline">
        	<input class="layui-input" type="text" id="time" name="time" value="${time?default('2019-11')}" placeholder="月份" style="display: inline-block;width: auto;">
      		<button class="layui-btn" lay-submit=""> <span class="fa fa-search"></span> 查询</button>
 		</div>
    </form>
</blockquote>
	<div id="echarts" style="height: 600px;" class="col-md-12 col-sm-12">

    </div>
</div>
</body>
<script src="${base}/js/jquery-2.1.4.min.js" type="text/javascript"></script>
<script src="${base}/js/echarts.js" type="text/javascript"></script>
<script src="${base}/layui/layui.all.js"></script>
<script src="${base}/laydate/laydate.js"></script>
<script>
layui.use('laydate', function(){
	  var laydate = layui.laydate;
	  laydate.render({ 
	    elem: '#time'
	    //,format: 'yyyy年MM月' //可任意组合
	    ,type:'month'
	  
	  });
});
	

var myChart = echarts.init(document.getElementById('echarts'));
var option = {
    tooltip: {
        trigger: 'axis',
    },
    legend: {
        data:['注册用户','消费','帖子']
    },
    xAxis: {
    	type : 'category',
        boundaryGap : false,
        data: [${key}]
    },
    yAxis: [ {
        type : 'value'
    }],
    series: [
    	{
            name: '注册用户',
            type: 'line',
            data: [${usersList}]            
        },
    	{
            name: '会员消费',
            type: 'line',
            data: [${vipList}]            
        },
    	{
            name: '帖子',
            type: 'line',
            data: [${cardList}]            
        }
    ]
    ,color:['#9ac4e4','#dd2222','#0070c9']
};
// 使用刚指定的配置项和数据显示图表。 ,color:['#9ac4e4']
myChart.setOption(option);
</script>
</html>